<template>
  <div>
    <div>当前图片ID：{{ imageID }}</div>
    <el-image :src="imagePath"></el-image>
  </div>
</template>

<script lang="ts">
import { defineComponent, onBeforeMount, ref } from "vue";
import { useRoute } from "vue-router";
import { getMainPicPath } from "@/api";

export default defineComponent({
  name: "SingleBigImage",
  setup() {
    const route = useRoute();
    const imageID = ref<string>("0");
    const imagePath = ref<string>("");
    onBeforeMount(() => {
      imageID.value = route.params.id as string;
      getMainPicPath(parseInt(imageID.value)).then((res) => {
        imagePath.value = res.data;
      });
    });
    return {
      imageID,
      imagePath,
    };
  },
});
</script>

<style scoped></style>
